<template>
    <div class="backgImage">
        <div class="div1">
            <TitleView title="问题统计" :titlemore="false" @titleClick="titleMoreClick"></TitleView>
            <div class="div1_d pl32 pr32">
                <Monitor :data="DataMonitor"></Monitor>
            </div>
        </div>
        <div class="div2">
            <TitleView title="问题总数统计" :titlemore="false" @titleClick="titleMoreClick"></TitleView>
            <div class="div1_d pl32 pr32">
                <SafeXRightB :data="dataB"/>
            </div>
        </div>
        <div class="div3">
            <TitleView title="重大危险源统计" :titlemore="false" @titleClick="titleMoreClick"></TitleView>
            <div class="div1_d pl32 pr32">
                <SafeXRightC :data="DataDevice"/>
            </div>
        </div>
    </div>
</template>

<script>
import SafeXRightC from "./components/SafeXRightC.vue";
import Monitor from '../ThreeD/components/Monitor.vue';
import SafeXRightB from "./components/SafeXRightB.vue";
import { safex_right } from "@/request/api";

export default {
    components: {
        SafeXRightC,
        Monitor,
        SafeXRightB
    },
    data(){
        return{
            DataMonitor: [
                {
                    
                    title: "重要问题",
                    number: "0",
                    
                }, {
                  
                    title: "一般问题",
                    number: "0",
                   
                }, {
                   
                    title: "自查问题",
                    number: "0",
                   
                }, {
                    
                    title: "问题统计",
                    number: "0",
                   
                },
            ],
            DataDevice: [],
            dataB:[]
        }
    },
    created() {
        this.getData()
    },
    methods: {
        titleMoreClick(msg) {
            console.log(msg);

        },
        getData() {
            safex_right().then((res) => {
                console.log("res:", res);
                this.DataMonitor=res.data.data1
                this.dataB=res.data.data2
                this.DataDevice=res.data.data3
            })
        }
    }
}
</script>

<style lang="scss" scoped>
.div1{
    height: 277px;
    .div1_d {
        margin-top: 20px;
    }
}
.div2{
    height: 343px;
    .div1_d {
        margin-top: 20px;
    }
}
.div3{
    .div1_d{

    }
}
</style>